/**
 * User: Célia Calçada
 * Date: 01-07-2013
 * Main view
 */

Ext.define('Mobile-app.view.Main', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.mainview',
    requires: [
        'Ext.TitleBar'
    ],
    config: {
        tabBarPosition: 'bottom',

        items: [
            {
                xtype: 'toolbar',
                docked: 'top',

                // Make the toolbar scrollable
                scrollable: {
                    direction: 'horizontal',
                    indicators: false
                },

                // Add several items into the toolbar
                items: [
                    {
                        id: 'welcome-msg',
                        text: 'Com-UT',
                        ui: 'plain'
                    },
                    { xtype: 'spacer' },
                    {
                        xtype: 'button',
                        text: $.t('main.exit'),
                        itemId: 'logOffButton',
                        iconMask: true,
                        iconCls: 'action'
                    }
                ]
            },
            {
                xtype: 'mobilepanel'
            },
            {
                xtype: 'mappanel'
            },
            {
                xtype: 'poipanel'
            },
            {
                xtype: 'driverpanel'
            },
            {
                xtype: 'trailerpanel'
            }
        ],
        listeners: [
            {
                event: 'painted',
                fn: 'onPaint'
            },{
                delegate: '#logOffButton',
                event: 'tap',
                fn: 'onLogOffButtonTap'
            }
        ]

    },

    /***
     * Used to trigger the log off event
     */
    onLogOffButtonTap: function () {
        this.fireEvent('signOffCommand');
    },

    /***
     * Called after painting main view panel
     */
    onPaint: function(){
        this.setTitle('Com-UT :: ' + Ext.app.user.userName);

        this.fireEvent('loadStore');
    },

    /***
     * Set the top toolbar title name
     * @param title The title text
     */
    setTitle: function(title){
        Ext.get('welcome-msg').setHtml(title);
    }
});